<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        table {
            width: 100px;
            height: 100px;
            margin: 0 auto;
        }

        table.gridtable {
            font-family: verdana, arial, sans-serif;
            font-size: 11px;
            color: #333333;
            border-width: 1px;
            border-color: #666666;
            border-collapse: collapse;
        }

        table.gridtable th {
            border-width: 1px;
            padding: 8px;
            border-style: solid;
            border-color: #666666;
            background-color: #dedede;
        }

        table.gridtable td {
            border-width: 1px;
            padding: 8px;
            border-style: solid;
            border-color: #666666;
            background-color: #ffffff;
        }
    </style>
</head>
<body>
<h1 align="center">The queried data is as follows:</h1>
<table class=gridtable width="100%" height="100%" cellpadding="0" cellspacing="0">
    <tr>
        <th>ID</th>
        <th>NAME</th>
        <th>AGE</th>
    </tr>

    <tbody>
    {% for i in list %}
        <tr>
            {% for j in i %}
                <td>{{ j }}</td>
            {% endfor %}
        </tr>
    {% endfor %}
    </tbody>
</table>
</body>
</html>